<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <link rel="stylesheet" href="css/information.css">
</head>
<body>
<script src="js/information.js"></script>
<div class=big-box>
  <div class=dh-box>
    <a href="index.html" class="dh-a1"><h1>咸菜</h1></a>
    <a href="index2.html" class="dh-a2"><img class="dh-img1" src="img/html-img/13.png" alt="个人中心" /></a>
    <h2>猪猪侠</h2>
    <a ><img class="dh-img2" src="img/html-img/17订单.png" /></a>
    <h2>订单</h2>
  </div>
  <div class="mid-box">
    <div class="mid1">
      <div class="mid1-1">
        <h1>消息</h1>
        <img src="img/html-img/小白菜.png" />
      </div>
      <a class="mid1-x">
        <img src="img/html-img/201.png" />
        <h1>林</h1>
      </a>
      <a class="mid1-x">
        <img src="img/html-img/18.png" />
        <h1>呆</h1>
      </a>
      <a class="mid1-x">
        <img src="img/html-img/19.png" />
        <h1>大</h1>
      </a>
      <a class="mid1-x">
        <img src="img/html-img/12.png" />
        <h1>二</h1>
      </a>
    </div>
    <div class="mid2">
      <div class="mid2-chatinformation">
        <div class="tubiao">
          <h1>
            小明
          </h1>
          <img src="img/html-img/11.png" />
        </div>
        <a href="index3.html" class="tubiao2">
          <img src="img/html-img/店铺 (4).png"/>
          <h1>个人主页</h1>
        </a>
      </div>
      <div class="chatcontent">
          <ol  class="ulbox"></ol>
      </div>
      <div class="fs">
        <textarea class=chatk placeholder="请输入你想要发送的内容"></textarea>
        <button class="sub">发送</button>
      </div>
    </div>
  </div>
</div>
</body>
</html>
<script>
  var btn=document.querySelector(".sub");
  var text=document.querySelector("textarea");
  var ol=document.querySelector("ol");
  btn.onclick=function(){
    if(text.value==""){
      alert("你没有输入内容");
      return false;
    }
    else{
      var li=document.createElement("li");
      li.innerHTML=text.value;
      //var dle=document.createElement("button");
     // dle.className='remove';
      //dle.innerHTML="删除";
     // dle.onclick=function(){
      //  ul.removeChild(this.parentNode);
     // };
     // li.appendChild(dle);
      ol.insertBefore(li ,ol.children[0]);
      text.value="";
    }
  };
</script>
